<!--
 * @Descripttion: 
 * @version: 
 * @Author: zhangjie
 * @Date: 2021-03-11 15:13:18
 * @LastEditors: 杨镜
 * @LastEditTime: 2022-11-04 21:17:18
-->

<template v-if="show">
  <!--积分体系设置-->
  <KiFormDialog
    :show.sync="dialogVisible"
    title="积分体系"
    v-model="form.data"
    :submit="submit"
    :before-close="()=>{$emit('update:show',false)}"
  >
  <template #el-form>
    <template v-if="orderInfo">
      <h3 class="subtitle"><span>订单信息</span></h3>
      <div class="mt20 mr30 ml30">
        <p>订单号：{{ orderInfo.orderId }}</p>
        <p>商品名称：{{ orderInfo.productName }}</p>
        <p>数量：{{ orderInfo.quantity }}</p>
        <p>实付积分：{{ orderInfo.integral }}</p>
        <p>订单状态：{{ orderInfo.statusName }}</p>
        <p>收件人姓名：{{ receiptInfo.name }}</p>
        <p>收件人手机：{{ receiptInfo.phone }}</p>
      </div>
      
      <h3 class="subtitle mb20"><span>确认退还积分</span></h3>
      <el-form-item label="退还原因：" prop="refundReason" :verify="{ minLength: 4, maxLength: 100}">
        <el-input v-model="form.data.refundReason" placeholder="请输入退还原因" clearable />
      </el-form-item>
      <el-form-item prop="text" label="请输入：" :verify="verifyCardNumber">
        <div>“我确定退还积分”</div>
        <el-input v-model="form.data.text" clearable />
      </el-form-item>
    </template>
  </template>
  </KiFormDialog>
</template>

<script>
export default {
  props: {
    show: Boolean,
    parentRowOrderId: String,
  },
  data() {
    let validateText = (rule, value, callback) => {
      if (value != '我确定退还积分') {
        return callback(new Error('请输入：“我确定退还积分”'));
      } else {
        callback()
      }
    }
    return {
      form: {
        data: {}
      },
      validateText,
      dialogVisible: false,
      orderInfo: {},
      receiptInfo: {},
      orderId: ''
    }
  },
  watch: {
    'parentRowOrderId' (newVal) {
      if(newVal) {
        this.orderId = newVal
      }
    },
    'show' (newVal) {
      this.dialogVisible = newVal
      if (newVal) {
        this.queryOrderDetail(this.$attrs.parentRowOrderId)
      }
    },
  },
  methods: {
    queryOrderDetail() {
      this.$POST('sot-admin-api/vip/vip-order-web/queryOrderDetail', {
        orderId: this.orderId
      }).then( _ => {
        const { order, receiptInfo } = _.data
        this.orderInfo = order
        this.receiptInfo = receiptInfo
      })
    },
    submit() {
      return this.$POST('sot-admin-api/vip/vip-order-web/backendRefund', {
        orderId: this.orderId,
        ...this.form.data
      }).then( _ => {
        this.$emit('refresh')
      })
    },
    verifyCardNumber(rule, value, callback) {
      if (value != '我确定退还积分') {
        return callback(new Error('请输入：“我确定退还积分”'));
      } else {
        callback()
      }
    }
  }
}
</script>
<style lang="scss" scoped>
</style>

